<template>
  <div class="content" @click="clickPlay()">
    <video
      v-if="isShowVideo"
      ref="videoPlay"
      controls
      class="video-player"
      :src="videoUrl"
    ></video>
  </div>
</template>

<script>
import { mapState } from "vuex";
export default {
  data() {
    return {
      videoUrl: "",
      isShowVideo: false
    };
  },
  computed: {
    ...mapState(["lang"])
  },
  mounted() {
    console.log("this.$route.query.url");

    this.videoUrl = this.$route.query.url;
    console.log(this.videoUrl);
    this.$forceUpdate();
  },
  methods: {
    clickPlay() {
      let isLogin = sessionStorage.getItem("vrToken");
      if (!isLogin) {
        this.$router.push({
          path: `login`
        });
        console.log("hasLogin 请登录");
      } else {
        this.isShowVideo = true;
      }
    }
  }
};
</script>

<style lang="scss" scoped>
.content {
  width: 100%;
  height: 100vh;
  background-image: url(../../../../assets/imgs/video-back.png);
  background-size: cover;
  display: flex;
  align-items: center;
  .video-player {
    width: 100%;
    height: auto;
    /* background-color: #409eff; */
  }
}
</style>
